// 左侧菜单样式
.el-scrollbar__view {
  &>.el-menu {
    user-select: none;
    width: 88%;
    margin: 8px auto;
    border-right: 0px;
    height: calc(100% - 16px);
    overflow-y: auto;
    overflow-x: hidden;

    &::-webkit-scrollbar {
      display: none;
    }

    .el-sub-menu.is-active {
      .el-menu {
        .el-menu-item {
          height: 35px;

          // margin: 8px 0;
          .gva-menu-item {
            .gva-menu-item-title {
              margin: 0px 0 0px 8px;
            }
          }
        }

        .el-sub-menu {
          margin: 8px 0;

          &.is-active {
            .el-sub-menu__title {
              // 二级目录
              background-color: #e9f2ff;
              height: 35px;
              color: #4592ff;
              border-radius: 7px;
              margin: 8px 0 8px 10px;
            }
          }

          .el-sub-menu__title {
            // 二级目录
            margin: 8px 0 8px 10px;
            height: 35px;
          }
        }
      }

      &>.el-sub-menu__title {
        background-color: #e9f2ff;
        color: #4592ff;
        height: 35px;
        border-radius: 7px;
        font-size: 15px;
      }
    }

    .el-sub-menu {
      margin: 8px 0;

      .el-menu {
        .el-menu-item {
          height: 35px;

          // margin: 8px 0;
          .gva-menu-item {
            .gva-menu-item-title {
              margin: 0px 0px 0px 8px;
            }
          }
        }

        .el-sub-menu {
          margin: 8px 0;

          .el-sub-menu__title {
            height: 35px;
            margin: 8px 0;
          }
        }
      }

      &>.el-sub-menu__title {
        height: 35px;
        font-size: 15px;
      }
    }

    // 第一层为非目录时的类名样式
    &>.el-menu-item {
      height: 35px;
      margin: 8px 0;

      .gva-menu-item {
        .gva-menu-item-title {
          font-size: 15px;
        }
      }
    }
  }

  // 左侧菜单 新皮肤
  &>.el-menu.custom-bg {
    // background-color: #198CFF;
    background: url('../assets/img/sider/leftside-bg.png') no-repeat center center;
    background-size: 100% 100%;
    margin: 0;
    height: 100%;
    width: 100%;
    color: #fff;
    // 
    // &::after{
    //   content: '';
    //   position: absolute;
    //   right: 0;
    //   bottom: 0;
    //   height: 290px;
    //   width: 220px;
    //   background:url('../assets/img/sider/leftside-bg.png') no-repeat center center;
    //   background-size: 100% 100%;
    //   opacity: .8;
    // }
    // 
    .el-sub-menu__icon-arrow{
      font-size: 16px;
    }
    // 
    .el-sub-menu.is-active {
      .el-sub-menu__title {
        // 二级目录
        background-color: transparent;
        height: 46px;
        line-height: 46px;
        margin: 0;
        color: #fff;
        
      }
    }
    .el-menu{
      background: transparent!important;
    }
    .el-menu-item{
      color: #fff;
      line-height: 46px!important;
      height: 46px!important;
      margin: 0!important;
      &:hover{
        background: rgba($color: #fff, $alpha: 0.2);;
      }
    }
    // 
    .el-menu-item.is-active{
      background-color: rgba($color: #fff, $alpha: 0.3);
      color: #fff;
      position: relative;
      // &::after{
      //   content:'';
      //   position: absolute;
      //   right: 0;
      //   top: 0;
      //   height: 100%;
      //   width: 4px;
      //   background-color: #fff;
      // }
    }
    // 
    .el-sub-menu__title{
      height: 46px;
      line-height: 46px;
      color: #fff;
    }
  }
}

.gva-menu-item-title {
  flex-shrink: 0 !important;
  overflow: hidden;
  /*超出的部分隐藏起来。*/
  white-space: nowrap;
  /*不显示的地方用省略号...代替*/
  text-overflow: ellipsis;
  /* 支持 IE */
  display: inline-block;
  width: 130px !important;
  flex: 130px 0 0 !important;
}

/* 前面为容器名称 */
.el-scrollbar__view div::-webkit-scrollbar {
  display: none;
}